Skip to main content

Media Gateway

We provide public endpoints for accessing NBA Top Shot media assets. Since media assets are associated with their corresponding on-chain identifier data, running scripts to acquire the on-chain identifiers are often necessary.

Documentation​

The endpoint can be accessed at:

https://assets.nbatopshot.com/media/${momentFlowID}/${mediaType}

momentFlowID​

momentFlowID is the flowId for the moment you are trying to access. To get a list of IDs for a given account, you can use the following cadence script:

import TopShot from 0xTOPSHOTADDRESS

pub fun main(account: Address): [UInt64] {

    let acct = getAccount(account)

    let collectionRef = acct.getCapability(/public/MomentCollection)
                            .borrow<&{TopShot.MomentCollectionPublic}>()!

    return collectionRef.getIDs()
}

The returned IDs can then be used to obtain the moments media.

mediaType​

mediaType can be selected from the following list:

https://assets.nbatopshot.com/media/1337/video-square

  • video-texture - main video that is seen on the moment page 1080x1080 with texture background

https://assets.nbatopshot.com/media/1337/video-texture

  • video-tall - main video that is seen on the moment page 1080x1920 with black background

https://assets.nbatopshot.com/media/1337/video-tall

  • image, hero - first frame from the moment

https://assets.nbatopshot.com/media/1337/image

https://assets.nbatopshot.com/media/1337/hero

https://assets.nbatopshot.com/media/1337/logos

  • game - image that shows the game scores **

https://assets.nbatopshot.com/media/1337/game

  • player - picture of the player

https://assets.nbatopshot.com/media/1337/player

https://assets.nbatopshot.com/media/1337/nft

  • transparent - first frame from the moment with transparent background

https://assets.nbatopshot.com/media/1337/transparent

  • hero-wide - first frame from the moment with wide background

https://assets.nbatopshot.com/media/1337/hero-wide

Resize Params​

The media gateway also supports resizing images by adding query params. You may add as many or as few as you like to suit your needs.

?format=${format}&quality=${quality}&width=${width}&height=${height}
note

The videos cannot be resized.

format​

the format of the image can be changed to suit your needs as seen in the cloudflare documentation. We recommend using webp

https://developers.cloudflare.com/images/image-resizing/resize-with-workers/#format

https://assets.nbatopshot.com/media/1337/image?format=webp

quality​

specifies the quality of the image, for a high quality images we recommend 90, for a lower quality image you can go with 50

https://developers.cloudflare.com/images/image-resizing/resize-with-workers/#quality

https://assets.nbatopshot.com/media/1337/image?quality=90

width​

the maximum width of the image

https://developers.cloudflare.com/images/image-resizing/resize-with-workers/#width

https://assets.nbatopshot.com/media/1337/image?width=500

height​

the maximum height of the image

https://developers.cloudflare.com/images/image-resizing/resize-with-workers/#height

https://assets.nbatopshot.com/media/1337/image?height=500